<link rel="stylesheet" href="lib/ztree/3.5/css/zTreeStyle.css">
<link rel="stylesheet" href="lib/codemirror/4.1/lib/codemirror.css">
<link rel="stylesheet" href="lib/datepicker/css/datepicker.css"/>
<link rel="stylesheet" href="app/solr/css/solr.css"/>

<div class="panel panel-default search-panel">
    <div class="panel-body">
        <div class="pull-left">
            <form class="form-inline">
                <div class="form-group">
                    <select class="form-control" ng-model="query_type">
                        <option value="">选择类型</option>
                        <option value="{{ TYPE_AUTO }}" ng-selected="query_type == TYPE_AUTO">自动备份</option>
                        <option value="{{ TYPE_MAN }}" ng-selected="query_type == TYPE_MAN">手动备份</option>
                    </select>
                </div>
                <div class="form-group">
                    <input type="text" id="query_startTime" class="form-control" placeholder="开始时间" />
                </div>
                <div class="form-group">
                    <input type="text" id="query_endTime" class="form-control" placeholder="结束时间" />
                </div>
                <button type="submit" class="btn btn-default" ng-click="query()">查找</button>
            </form>
        </div>
        <div class="pull-right">
            <button type="button" class="btn btn-primary" ng-click="edit()">
                创建备份
                <span class="glyphicon glyphicon-plus-sign"></span>
            </button>
        </div>
        <div class="clearfix"></div>
    </div>
</div>

<table class="table table-striped table-bordered table-hover">
    <tr>
        <th>ZK路径</th>
        <th>备份类型</th>
        <th>描述</th>
        <th>创建时间</th>
        <th>操作</th>
    </tr>
    <tr ng-repeat="backup in paged.list">
        <td>{{ backup.path }}</td>
        <td>
            <span class="label label-primary" ng-show="backup.type == TYPE_AUTO">自动备份</span>
            <span class="label label-info" ng-show="backup.type == TYPE_MAN">手动备份</span>
        </td>
        <td>{{ backup.remark }}</td>
        <td>{{ backup.createTime | date: 'yyyy-MM-dd HH:mm:ss' }}</td>
        <td>
            <button type="button" class="btn btn-default" ng-click="view(backup)">查看</button>
            <button type="button" class="btn btn-danger" ng-click="confirmRemove(backup)">删除</button>
        </td>
    </tr>
</table>
<div>
    <div class="pull-left">
    </div>
    <div ng-include="'app/common/view/paged.html'"></div>
    <div class="clearfix"></div>
</div>

<!-- edit dialog -->
<div class="modal fade" id="editDialog" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">创建备份</h4>
            </div>
            <div class="modal-body">
                <div id="editErrorMsg" class="alert alert-danger" ng-show="save_err">{{ save_errMsg }}</div>
                <form class="form-horizontal" role="form" id="editForm">
                    <div class="form-group">
                        <label for="save_path" class="col-sm-2 control-label">备份路径</label>
                        <div class="col-sm-9">
                            <input type="text" class="form-control" id="save_path" ng-model="save_path" placeholder="备份ZK路径" />
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="save_remark" class="col-sm-2 control-label">描述</label>
                        <div class="col-sm-9">
                            <textarea id="save_remark" ng-model="save_remark" class="form-control" placeholder="描述"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" ng-click="save()">保存</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<!-- disableAll dialog -->
<div class="modal fade" id="removeDialog" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">删除确认</h4>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning">您确认要删除吗。</div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" ng-click="remove()">确认删除</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<style type="text/css">
    .CodeMirror{
        height: 650px;
    }
</style>

<!-- disableAll dialog -->
<div class="modal fade" id="viewDialog" tabindex="-1">
    <div class="modal-dialog" style="width: 1200px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">查看备份详细</h4>
            </div>
            <div class="modal-body" style="height: 700px;">
                <div class="col-sm-2">
                    <ul id="zkTree" class="ztree"></ul>
                </div>
                <div class="col-sm-10">
                    <textarea id="backup_code" name="config_code"></textarea>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
</div>